@charset "UTF-8";/* 初始化*/
@import "step";
body{
    background: #222222;
    color: #fff;
    a{
        color: #fff;
        &:hover{
            color: $theme;
        }
    }
    .title{
        color: #ffffff;
        h2,.bt,.bt2{
            color: #fff !important;
        }
        .more{
            color: #fff;
        }
      }
      .scroll{
        &::-webkit-scrollbar { width: 4px !important; height: 4px; background: rgba(255,255,255,0.2) !important; border-radius: 10px; }
        &::-webkit-scrollbar-button { width: 0; height: 0; }
        &::-webkit-scrollbar-corner { display: block; }
        &::-webkit-scrollbar-thumb { background-clip: padding-box; background-color: #fff !important; border-radius: 10px; }
   
    }
}
.header_warp {
    background: #131313;
    .header_top{
        background: none;
        border-color: #000;
        .lab{
            color: #fff;
            border-color: #fff;
        }
        .flex .search.on{
            border-color: #333;
            background: #333;
            .input  input {
                background: none;
                color: #fff;
            }

        }
        .layui-nav-child{
            background: #000;
            color: #fff;
            border-color: #333;
            a{
                color: #fff;
                &:hover{
                    background-color: #333;
                }
            }
            .layui-this{
                background-color: #333;
                a{
                    color: #fff;
                }
            }
        }
        .layui-nav .layui-nav-more{
            color: #fff;
        }
    }
    .swiper_nav .switch_ i , .burger .switch_nav .hidebox i{
        width: 0.17rem;
        height: 0.31rem;
        background-position: 0 -0.54rem;
        transform: rotate(90deg) scale(0.8);
    }
    .burger .switch_nav{
        background-color: #222;
        .lis {
            a{
                background: #333;
                color: #fff;
            }
        }
    }
}
.icogame{
    background: url("../images/ico-gamedb.png") no-repeat center;
    background-size: 8rem auto;
}
.layui-layer.darkthem ,.layui-layer-move ,.layui-layer.layui-layer-dialog.layui-layer-msg{
    background: #1b1b1b;
    background-color: #1b1b1b !important;
    box-shadow: 1px 1px 10px rgba(255,255,255,0.5);
    border-radius: 10px;
    .layui-layer-title{
        color: #fff;
    }
    .layui-layer-content{
        overflow:visible;
    }
}
.layeralterthem{
    background: none !important;
    box-shadow: none;
}
.layui-layer.layui-layer-dialog.layui-layer-msg{
    .layui-layer-ico{
        border-radius: 50% !important;
    }
}
.gamedbwarp{
    position: relative;
    overflow: hidden;
    min-height: 80vh;
    padding-top: 0.3rem;
    .gamedbbj{
        background: no-repeat center top #2a2a2a;
        background-size: 100% auto;
        overflow: hidden;
        min-height: 40vh;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        &::before{
            content: '';
            width: 100%;
            height: 40vh;
            top: 0.3rem;
            left: 0;
            position: absolute;
            background: linear-gradient(to bottom, rgba(42,42,42,0) 0%,rgba(42,42,42,0.95) 40%,rgba(42,42,42,1) 70%);
        }
    }
   
   
}
.gamedbcenter{
    position: relative;
    z-index: 1;
    padding: 0 0.3rem;
}
.gamedbitem{
    padding: 0.2rem 0;
    padding-bottom: 0.2rem;
    border-bottom: 0.05rem solid rgba(255,255,255,0.05);
    &:last-child{
        border:none;
    }
}
.gamedbitem1{
    padding: 0;
  .box{
    overflow: hidden;
    .imgbaner{
        width:1.9rem;
        height: 2.4rem;
        display: block;
        float: left;
        margin: 0 0.2rem 0rem 0;
        border-radius: 0.1rem;
        overflow: hidden;
        img{
            width: 100%;
            height: 100%;
        }
    }
    .infor{
        .bt{
            height: 0.6rem;
            line-height: 0.6rem;
            white-space: nowrap;
            word-break: break-all;
            font-size: 0.36rem;
            font-weight: bold;
            overflow: hidden;
        }
        .text{
            font-size: 0.24rem;
            line-height: 0.45rem;
        }
        .tabbox{
            font-size: 0;
            .tab{
                display: inline-block;
                height: 0.44rem;
                color: #fff;
                line-height: 0.44rem;
                max-width: 60%;
                overflow: hidden;
                padding: 0 0.15rem;
                border-radius: 0.05rem;
                box-sizing: border-box;
                font-size: 0.22rem;
                margin: 0.1rem 0.2rem 0.1rem 0;
            }
            .cor1{ background-color: #a70c1e; }
            .cor2{ background-color: #007bff; }
            .cor3{ background-color: #1c5292; }
            .cor4{ background-color: #4b31b0; }
            .cor5{ background-color: #007bff; }
            .cor6{ background-color: #0a0a64; }
            .cor7{ background-color: #0c0c0b; }
            .cor8{ background-color: #57880a; }
            .cor9{ background-color: #36a567; }
            .cor10{ background-color: #7e8e9d; }
            .cor11{ background-color: #3D090B; }
            .cor12{ background-color: #6D6359; }
            .cor13{ background-color: #FFD42A; }
            .cor14{ background-color: #009AC7; }
            .cor15{ background-color: #695EE8; }
            .cor16{ background-color: #003791; }
            .cor17{ background-color: #231F20; }
            .cor18{ background-color: #565B65; }
            .cor19{ background-color: #25BAA6; }
            .cor20{ background-color: #D2BFE1; }
            .cor21{ background-color: #FFC557; }
            .cor22{ background-color: #C92344; }
            .cor23{ background-color: #107C10; }
        }
    }
  }
  .ckbox{
    display: flex;
    justify-content: space-between;
    padding: 0.2rem 0 0.1rem;
    li{
        width: 0.7rem;
        height: 1.1rem;
        text-align: center;
        font-size: 0.24rem;
        color: #fdfdfc;
        background: rgba(0,0,0,0.8);
        border-radius: 0.05rem;
        cursor: pointer;
        .ico{
            position: relative;
            height: 0.5rem;
            text-align: center;
            i{
                display: block;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);

            }
            .ico1{width: 0.35rem; height: 0.35rem; background-position: -4.00rem  0;}
            .ico2{width: 0.38rem; height: 0.33rem; background-position: -5.00rem  0;}
            .ico3{width: 0.35rem; height: 0.35rem; background-position: -2.00rem  0;}
            .ico4{width: 0.33rem; height: 0.33rem; background-position: -1.50rem  0;}
            .ico5{width: 0.35rem; height: 0.34rem; background-position: -2.50rem  0;}
            .ico6{width: 0.35rem; height: 0.35rem; background-position: -1.00rem  0;}
            .ico7{width: 0.31rem; height: 0.33rem; background-position: -0.50rem 0;}
           
        }
        .num ,p{
            height: 0.3rem;
            line-height: 0.3rem;
            opacity: 0.8;
            transform: scale(0.8);
        }
        &:hover,&.on{
            .ico i{
                background-position-y:-0.5rem !important;
            }
            color: #007bff;
            
        }
    }
  }
}
.gamedbitem2{
    overflow: hidden;
    padding: 0.3rem 0 0.1rem;
    ul{
        width: 104%;
        li{
            float: left;
            width: 1.6rem;
            height: 1.06rem;
            background-color: #333333;
            border-radius: 0.05rem;
            margin: 0 0.16rem 0.2rem 0;
            border:0.02rem solid transparent;
            padding: 0.05rem 0.1rem;
            text-align: center;
            cursor: pointer;
            box-sizing: border-box;
            .img_{
                height: 0.5rem;
                width: 100%;
                position: relative;
                overflow: hidden;
                //  filter: gray; 
                //  opacity: 0.7;
                 filter: grayscale(100%);
                 filter: none; 
                 opacity: 1;
                img{
                    display: block;
                    position: absolute;
                    top: 50%;
                    left: 50%;
                    transform: translate(-50%,-50%);
                    max-width: 80%;
                    width: auto;
                    max-height: 100%;

                }

            }
            p{
                height: 0.5rem;
                line-height: 0.5rem;
                color: #ffffff;
                // opacity: 0.8;
                 opacity:1;
                font-size: 0.2rem;
                display: flex;
                align-items: center;
                justify-content: center;
                letter-spacing: 0.03rem;
                span{
                    font-size: 0.31rem;
                    letter-spacing: 0px;
                    padding-right: 0.04rem;
                }
            }
            .stare{
                background: url("../images/icostar.png") no-repeat center;
                height: 0.22rem;
                background-size: 100% auto;
                width: 1.3rem;
                margin: 0.12rem auto;
                position: relative;
                overflow: hidden;
                background-position: 0 0;
                i{
                    display: block;
                    position: absolute;
                    top: 0;
                    left: 0;
                    overflow: hidden;
                    height: 100%;
                    &::after{
                        display: block;
                        content: '';
                        width: 1.3rem;
                        background: url("../images/icostar.png") no-repeat center;
                        height: 0.22rem;
                        background-size: 100% auto;
                        background-position: 0 -0.21rem;
                    }
                }

            }
            &:active{
                border-color: $theme;
            }
            &:active,&.on{
                p{
                    opacity: 1;
                }
                .img_{
                    filter: grayscale(100%);
                    filter: none; 
                    opacity: 1;
                }
               
            }
        }
    }
}
.gamedbitem3{
    position: relative;
    .video-img{
        width: 100%;
        height:3.9rem;
        position: relative;
        img{
            width: 100%;
            height: 100%;
            display: block;
            object-fit: cover;
        }
        iframe{
            width: 100%;
            height: 100%;
        }
    }
     .swiper_btn { position: absolute; width: 0.5rem; height: 0.8rem; display: block; top: 50%; margin-top: -0.4rem; z-index: 1; background: rgba(0, 0, 0, 0.5); }
    .swiper_btn i { display: block; width: 0.17rem; height: 0.31rem; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; }
    .prev { left: 0; }
    .prev i { background-position: -0.28rem -0.52rem; }
    .next { right: 0; }
    .next i { background-position: 0 -0.54rem; }
    .videoimgbox{
        padding: 0.2rem 0;
        .swiper-slide{
            cursor: pointer;
            float: left;
            width: 1.95rem;
            height: 1.2rem;
            border: solid 1px transparent;
            border-radius: 0.05rem;
            position: relative;
            overflow: hidden;
            // margin: 0 0.15rem 0 0;
            box-sizing: border-box;
            img{
                width: 100%;
                height: 100%;
                display: block;
                object-fit: cover;
            }
            &::after{
                display: block;
                content: '';
                position: absolute;
                top: 0;
                left: 0;
                display: block;
                width: 100%;
                height: 100%;
                background: rgba(0,0,0,0.65);
            }
            i{
                display: block;
                content: '';
                position: absolute;
                background: url("../images/video.png") no-repeat center;
                width: 0.36rem;
                height: 0.36rem;
                background-size: 100% auto;
                top: 50%;
                left: 50%;
                transform: translate(-50%,-50%);
                z-index: 1;
            }
            &:hover,&.on{
                border-color: $theme;
            }

        }
        .swiper-slide-active{
            border-color: $theme;
        }
    }
}
.gamedb-item{
    .title{
        padding: 0;
        height: 0.6rem;
        line-height: 0.6rem;
    }
    .text{
        line-height: 0.5rem;
        color: #f6f5f5;
        word-wrap: break-word;
    }
    .ul1{
        display: flex;
        flex-wrap: wrap;
        padding: 5px 0;
        li{
            line-height: 0.4rem;
            min-width: 40%;
            padding: 0.05rem 0.2rem 0.05rem 0;
            a{
                color: $theme;
                &[href]:hover{
                    text-decoration: underline;
                }
            }
            &:nth-child(3n){
                text-align: right;
            }
        }
    }
    .ul2{
        padding: 0.05rem 0;
        overflow: hidden;
        p{
            display: inline-block;
            vertical-align: middle;
            line-height: 0.5rem;
            min-width: 33.33%;
            padding-right: 0.2rem;
        }
        a{
            color: $theme;
            &[href]:hover{
                text-decoration: underline;
            }
        }
       
    }
    .link{
        overflow: hidden;
        li{
            float: left;
            min-width: 20%;
            height: 0.4rem;
            line-height:  0.4rem;
            padding: 0.1rem 0.2rem 0.1rem 0;
            max-width: 80%;
        }
        .lis{
            display: block;
            color: #fff;
            height: 100%;
            overflow: hidden;
            &:hover{
                color: $theme;
            }
            img{
                max-height: 100%;
                width: auto;
                display: inline-block;
                vertical-align: middle;
            }
            span{
                padding-left: 0.1rem;
            }
        }
    }
    table{
        color: #fff;
        width: 100%;
        line-height: 0.4rem;
        tr{
            display: table-row;
            text-align: center;
            td{
                padding: 0.1rem 0;
                line-height: 0.4rem;
                height: 0.4rem;
                overflow: hidden;
                max-width: 2rem;
                word-break: break-all;
                &:first-child{
                    text-align: left;
                }
                &:last-child{
                    text-align: right;
                }
            }
            &:nth-child(6n+1) .lab{background-color: #000080;}
            &:nth-child(6n+2) .lab{background:none;line-height: 0.38rem; border:0.01rem solid #007bff; color: #007bff;}
            &:nth-child(6n+3) .lab{background-color: #57880a;}
            &:nth-child(6n+4) .lab{background-color: #027db4;}
            &:nth-child(6n+5) .lab{background-color: #70b603;}
            &:nth-child(6n+6) .lab{background-color: #c32933;}
            &:hover{
                color: $theme;
                a{
                    color: $theme;
                }
            }
        }
        .lab{
            display: inline-block;
            vertical-align: middle;
            height: 0.4rem;
            padding: 0 0.1rem;
            box-sizing: border-box;
            color: #fff;
            background: $theme;
            border-radius: 0.05rem;
        }
        a{
            color: #fff;

        }
    }
    .list{
       li{
        display: flex;
        height: 0.4rem;
        padding: 0.1rem 0;
        line-height: 0.4rem;
        overflow: hidden;
        p{
            transform: scale(0.8);
            margin-right: -0.1rem;
            position: relative;
        }
        .flex1{
            flex: 1;
            overflow: hidden;
            .tex{
                max-width: 70%;
                overflow: hidden;
               float: left;
               white-space: nowrap;
               text-overflow: ellipsis;
            }
           
            img{
                max-height: 100%;
                width: auto;
                padding-left: 0.05rem;
            }
        }
       }
    }
    .tablis{
        padding: 0.05rem 0;
        width: calc(100% + 20px);
        .tab{
            display: inline-block;
            vertical-align: middle;
            border: solid 1px rgba(255,255,255,0.3);
            border-radius: 0.1rem;
            height: 0.6rem;
            line-height: 0.6rem;
            padding: 0 0.1rem;
            min-width: 0.4rem;
            color: #f5f5f5;
            margin: 0.1rem 0.1rem 0.1rem 0;
            cursor: pointer;
            position: relative;
            &.on{
                color: $theme;
                border-color: $theme;
            }
            &.up{
                border-color: $theme;
                &::before,&::after{
                    content: '';
                    display: block;
                    position: absolute;
                    transform: translate(-50%,-50%);
                    top: 50%;
                    left: 50%;
                    background: $theme;
                }
                &::before{
                    width: 1px;
                    height: 0.15rem;
                }
                &::after{
                    width: 0.15rem;
                    height: 1px;

                }
            }
        }
    }
    .ul{
        .li{
            color: #fff;
            line-height: 0.7rem;
            overflow: hidden;
            display: flex;
            height:  0.7rem;
            &:hover{
                color: $theme;
            }
            p{
                display: block;
                float: left;
                &:nth-child(2){
                    flex: 1;
                    text-align: center;
                }
                &:last-child{
                    float: right;
                }
            }
        }
    }
    .ulthem{
        .li{
            display: block;
        }
    }
}
.gamedbtishi{
    font-size: 0.2rem;
    line-height: 0.4rem;
    padding: 0.2rem 0;
    color: rgba(255,255,255,0.5);
}
.swiper-child{
    padding: 0;
}
.gamedblisth1{
    padding: 0.1rem 0;
    .bt{
        overflow: hidden;
        font-size: 0.3rem;
        font-weight: normal;
        line-height: 0.5rem;
    }
    .more{
        font-size: 0.24rem;
    }
}
.evaluatewarp{
    .evaluate_header{
       .evaluate_score {
        width: 2rem;
       }
       .evaluate_score.no{
          color: #bdbdbd; 
       }
       .iconsvg2{
           fill:#bdbdbd !important;
        }
       .evaluate_line ul li{
           .icobox {
                margin:0 0.2rem;
               .iconsvg{
                   fill:$theme;
                }
            }
       }
    }
    .evaluate_total_stare{
        color: #fff;
    }
    .evaluate_textarea{
        .textarea{
            border-color: rgba(255, 255, 255, 0.5) !important;
        }
       textarea{
           background-color: #222222 !important;
           color: #fff;
       }
       .tishi{
           line-height: 0.4rem;
           padding-top: 0.1rem;
           color: rgba(255, 255, 255, 0.5);
           & + .submitbtn{
               margin-top: 0.2rem !important;
               float: none;
               margin: 0 auto;
               width: auto;
               max-width: 2rem;
               padding: 0 0.1rem;
           }
       }
    }
   .evaluatelist{
    .EV_list .item_{
        background: rgba(0, 0, 0, 0.1) !important;
        .user_ .infor .name , 
        .text_p p,
        .text_p p a{
          color: #fff;
       }
       .user_ .infor .time , 
       .scorebox p,
       .tab_p .btn_{
           color: #b3b3b3;
       }
        
     }
   }
}
.morelink{
    border:1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
}
.page{
    & > a{
        background: #000;
        color: #fff;
    }
    & > span .cbtn{
        background: #000;
        color: #fff;
        a{
            background: #000;
            color: #ffff;
            &:active ,&:hover{
                background: $theme;
            }

        }
    }
}
.layerevaluatewarp{
    background: #1b1b1b !important;
    box-shadow: 1px 1px 0.1rem rgba(255,255,255,0.5) !important;
    .textarea  {
        background: #333;
        padding: 0.1rem 0.2rem;
        border-radius: 0.05rem;
        margin: 0 0.2rem 0.2rem;
        textarea {
            background: #333;
            color: #fff;
        }
    }
    .text{
        background: none !important;
        .bt span{
            color: $theme;
        }
    }
    .btnbox{
        border-color: #000;
        .btn{
            color: #fff;
            border-color: transparent;
        }
    }
}

.layerPurchased{
    padding: 0.2rem;
    display: none;
    width: 4rem;
    .bt{
        color: #fdfdfc;
        opacity: 0.8;
        height: 0.6rem;
        line-height: 0.6rem;
        font-size: 0.28rem;
        overflow: hidden;
        padding-bottom: 0.2rem;
    }
    ul{
        overflow-y: auto;
        overflow-x: hidden;
        max-height: 5rem;
        min-height: 2.4rem;
        li{
            height: 0.4rem;
            line-height: 0.4rem;
            padding: 0.1rem 0;
            display: flex;
            overflow: hidden;
            & >a{
                display: flex;
                flex: 1;
                overflow: hidden;
                &:active{
                    color: $theme !important;
                    img{
                        border-color: $theme !important;
                    }
                    p,.time{
                        color: $theme !important;
                        opacity: 1;
                    }
                }
            }
            img{
                height: 0.4rem;
                width: 0.4rem;
                object-fit: cover;
                border-radius: 50%;
                overflow: hidden;
                box-sizing: border-box;
                border:1px solid transparent;
            }
            p{
                color: #fdfdfc;
                flex: 1;
                overflow: hidden;
                padding: 0 0.1rem;
                margin-right: 0.1rem;
                text-align: center;
                opacity: 0.8;
            }
            .time{
                color: #fdfdfc;
                opacity: 0.8;
            } 

        }
    }
}
.layernamescore{
    padding: 0.2rem ;
    display: none;
    width: 6.5rem;
    .item{
        display: flex;
    }
    .img_{
        width: 0.8rem;
        height: 0.8rem;
        display: block;
        border-radius: 50%;
        overflow: hidden;
        img{
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    .infor{
        flex: 1;
        overflow: hidden;
        padding-left: 0.2rem;
        color: #ffffff;
        .name{
            font-size: 0.3rem;
            color: #ffffff;
            line-height: 0.5rem;
            float: left;
            max-width: 60%;
            font-weight: bold;
        }
        .time{
            font-size: 0.2rem;
            float: right;
            max-width: 40%;
            text-align: right;
            padding-top: 0.1rem;
        }
        .score-tex{
            float: left;
            width: 100%;
            height: 0.5rem;
            line-height: 0.5rem;
            font-size: 0.3rem;
            font-weight: bold;
        }
        .text{
            float: left;
            width: 100%;
            line-height: 0.4rem;
            overflow: hidden;
            padding-top: 0.1rem;

        }
        .more{
            float: left;
            color: $theme;
            line-height: 0.5rem;
            cursor: pointer;

        }

    }

}
.layerevaluate-author{
    padding: 0.2rem;
    width: 6rem;
    display: none;
    .title{
        font-size: 0.3rem;
        line-height: 0.6rem;
        height: 0.6rem;
        overflow: hidden;
        padding: 0;
    }
    .title-level{
        line-height: 0.4rem;
        padding: 0.1rem 0;
    }
    .layui-ratebox{
         height: 0.5rem; line-height: 0.5rem;  
        .layui-rate { padding: 0;  margin-top: -2px; }
        .layui-rate .layui-icon { background: url("../images/star_default.png") repeat-x left; width: 0.25rem; height: 0.25rem; background-size: 100% auto; }
        .layui-rate .layui-icon::before { display: none; }
        .layui-rate .layui-icon-rate-solid { background-image: url("../images/star_on.png"); }
        
    }
    .textarea{
        border-radius: 0.05rem;
        border:0.02rem solid rgba(255, 255, 255, 0.5);
        padding: 0.15rem 0.2rem;
        margin: 0.1rem 0;
        textarea{
            line-height: 0.4rem;
            height: 1.6rem;
            background: none;
            color: #fff;
            width: 100%;
            border:none;
            resize: none;
            outline: none;
        }
    }
    .tishi{
        line-height: 0.4rem;
        padding-top: 0.1rem;

    }
    .btn{
        width: 2rem;
        height: 0.6rem;
        border: solid 0.01rem #f5f5f5;
        line-height:  0.6rem;
        border-radius: 0.2rem;
        text-align: center;
        margin: 0.2rem auto 0.1rem;
        display: block;
        cursor: pointer;
        font-size: 0.28rem;
        &:hover{
            background: $theme;
            color: #fff;

        }
        
    }
  
}
.layerlabel{
    width: 6.4rem;
    padding: 0.2rem;
    display: none;
    .title{
        font-size: 0.3rem;
        line-height: 0.6rem;
        height: 0.6rem;
        overflow: hidden;
        padding: 0;
    }
    
    .tablis{
        padding: 0.05rem 0;
        width: calc(100% + 0.2rem);
        .tab{
            display: inline-block;
            vertical-align: middle;
            border: solid 1px rgba(255,255,255,0.3);
            border-radius: 0.1rem;
            height: 0.6rem;
            line-height: 0.6rem;
            padding: 0 0.1rem;
            min-width: 0.4rem;
            color: #f5f5f5;
            margin: 0.1rem 0.1rem 0.1rem 0;
            cursor: pointer;
            position: relative;
            &.on{
                color: $theme;
                border-color: $theme;
            }
            &.up{
                border-color: $theme;
                &::before,&::after{
                    content: '';
                    display: block;
                    position: absolute;
                    transform: translate(-50%,-50%);
                    top: 50%;
                    left: 50%;
                    background: $theme;
                }
                &::before{
                    width: 1px;
                    height: 0.15rem;
                }
                &::after{
                    width: 0.15rem;
                    height: 1px;

                }
            }
        }
    }
    .inputbox{
        border: solid 1px #0066ff;
        height: 0.5rem;
        line-height: 0.5rem;
        display: flex;
        color: rgba(245,245,245,0.3);
        padding: 0 0.1rem;
        border-radius: 0.05rem;
        input{
            flex: 1;
            overflow: hidden;
            padding-right:0.1rem;
            height: 100%;
            display: block;
            line-height: 0.5rem;
            border:none;
            background: none;
            outline: none;
            color: #fff;

        }
        span{
            cursor: pointer;
            &:hover{
                color: #fff;
            }
        }
    }
    .btn{
        width: 2rem;
        height: 0.5rem;
        border: solid 1px $theme;
        line-height: 0.5rem;
        border-radius: 0.25rem;
        text-align: center;
        margin: 0.2rem auto 0.1rem;
        display: block;
        color: #fff;
        cursor: pointer;
        font-size: 0.28rem;
        &:hover{
            background: $theme;
        }
        
    }
}
.layertipsgamedb{
    .layui-layer-content{
        border-radius: 5px !important;
        background: #fff !important;
        color: #1c1b1b !important;
        font-size: 0.24rem !important;
        margin-top: 0.2rem;
    }
    .commt{
        .icogame{
            width: 0.27rem;
            height: 0.27rem;
            display: inline-block;
            vertical-align: middle;
            margin: 0px 0.1rem 0 0;
            background-position: -6rem -0.5rem;
        }
        .text{
            display: inline-block;
            vertical-align: middle;
        }
    }
    i{
        display: none !important;
    }
}
.layeralter{
    display: none;
    background: #000;
    padding: 0.1rem ;
    .commt{
        .icogame{
            width: 0.27rem;
            height: 0.27rem;
            display: inline-block;
            vertical-align: middle;
            margin: 0px 0.1rem 0 0;
            background-position: -6rem -0.5rem;
        }
        .text{
            display: inline-block;
            vertical-align: middle;
        }
    } 
}
.layercontribution{
    width: 6.4rem;
    padding: 0.2rem;
    display: none;
    .title{
        font-size: 0.3rem;
        line-height: 0.6rem;
        height: 0.6rem;
        overflow: hidden;
        padding: 0;
    }
    .bt{
        height: 0.5rem;
        line-height:  0.5rem;
        font-size: 0.24rem;
    }
    .tabbox{
        overflow: hidden;
        padding-top: 0.1rem;
        li{
            float: left;
            text-align: center;
            line-height: 0.4rem;
            margin: 0.1rem 0;
            cursor: pointer;
            position: relative;
            &:hover{
                color: $theme;
            }
            &::after{
                width: 0.02rem;
                height: 0.25rem;
                background: #fff;
                content: '';
                display: inline-block;
                vertical-align: middle;
                margin: 0 0.3rem;
            }
            &:nth-child(3n) ,&:last-child{  &::after{display: none;}   }
        }
    }
}
.layercontriwarp{
    width: 6.4rem;
    padding: 0.2rem;
    display: none;
    .boxitem{
        display: none;
    }
    .title{
        font-size: 0.3rem;
        line-height: 0.6rem;
        height: 0.6rem;
        overflow: hidden;
        padding: 0;
    }
    .input_lis{
        display: flex;
        align-items: center;
        height: 0.5rem;
        line-height:  0.5rem;
        margin-bottom: 0.1rem;
        font-size: 0.2rem;
        & + .input_lis{
            margin-top: 0.3rem;
        }
       .input{
        flex: 1;
        max-width: 50%;
        overflow: hidden;
        border: solid 0.01rem #f5f5f5;
        line-height: 0.48rem;
        background-color: #ffffff;
        border-radius: 0.05rem;
        margin-left: 0.2rem;
        padding: 0 0.1rem;
        position: relative;
        span{
            color: #434343;
            opacity: 0.7;
            font-size: 0.2rem;
        }
       .file{
          position: absolute;
          width: 100%;
          height: 100%;
          top: 0;
          left: 0;
          opacity: 0;
          cursor: pointer;
        }

       } 
       .layui-form-select{
        background: none !important;
        .layui-input{
            background: none;
            height: 0.48rem;
            line-height:0.48rem;
            border:none !important;
            color: #fff;
            &::placeholder{
                color: #fff;
            }
        }
        dl{
            background: #1b1b1b;
            border-color: #000;
            line-height: 0.5rem;
            top: 0.5rem;
            dd{
                height: 0.5rem;
                line-height: 0.5rem;
            }
            dd:hover{
                background: #000;
            }
        }
        .layui-edge{
            border-top-color: #fff;
            
        }
       }
       .line{
        width: 0.04rem;
        height: 0.25rem;
        margin: 0 0.1rem 0 0.05rem;
        border-radius: 0.02rem;
        background: #fff;
       }
       .layui-input-inline{
        display: flex;
        margin: 0;
        left: 0;
        width: 190px !important;
         .layui-input{
            height: 0.48rem;
            line-height: 0.48rem;
            background: none;
            border:none;
            flex: 1;
            color: #fff;
            border-bottom: 0.01rem solid #fff;
            padding-left: 0;
            margin-left: 0.1rem;
            font-size: 0.24rem;
            &::placeholder{
                color: #fff;
            }

         }
       }
       .flex1{
        flex: 1;
        display: flex;
        align-items: center;
        min-width: 1.8rem;
        .layui-form-label{
            width: auto;
            padding: 0;
            margin-right: 0.15rem;
        }
       }
    }
    .layui-textarea{
        background: #333;
        resize: none;
        border:none;
        color: #fff;
        line-height: 0.4rem;
        min-height: 1.6rem;
        &::placeholder{
            color: #fff;
        }
        &.them{
            margin: 0.2rem 0;
            min-height: 1.2rem;
        }

    }
    .layui-input-block{
        min-height: auto;
        margin-left: 0;
        flex: 1;
        .input{
            height: auto;
            max-width:100%;
            margin-left: 0px;
            font-size: 0.24rem;
        }
    }
    .text{
        line-height: 0.4rem;
        word-break: break-all;
        .red{
            color: #ff5c5c;
        }
        p{
            padding: 0.05rem 0;
            &::before{
                content: '';
                display: inline-block;
                vertical-align: middle;
                width: 2px;
                height: 2px;
                background: #fff;
                margin: -1px 0.1rem 0 0;

            }
        }
    }
    .submit{
        width: 1.87rem;
        height: 0.5rem;
        border: solid 0.02rem $theme;
        line-height: 0.5rem;
        border-radius: 0.5rem;
        text-align: center;
        margin: 0.4rem auto 0.1rem;
        display: block;
        color: #fff;
        cursor: pointer;
        font-size: 0.3rem;
        padding: 0;
        box-sizing: content-box;
        &:hover{
            background: $theme;
        }
    }
    .layui-form-danger+.layui-form-select .layui-input ,.layui-textarea.layui-form-danger:focus{
        border-color: #FF5722!important;
        border:1px solid #FF5722 !important; 
    }
    .layui-form-danger:focus{
        border-color: #FF5722!important;
    }
    .xm-select-parent .xm-select-title {
        height: auto !important;
        .xm-select{
            // max-height: 50px;
            height: 100%;
            overflow:visible;
            .xm-select-label{
                height: 50px;
                overflow-y: auto;
                &::-webkit-scrollbar { width: 4px !important; height: 4px; background: rgba(255,255,255,0.2) !important; border-radius: 10px; }
                &::-webkit-scrollbar-button { width: 0; height: 0; }
                &::-webkit-scrollbar-corner { display: block; }
                &::-webkit-scrollbar-thumb { background-clip: padding-box; background-color: #fff !important; border-radius: 10px; }
            }
        }
        div.xm-select-label>span{
            background: $theme;
            border-color: $theme;
            height: 15px;
            line-height: 15px;
            font-size: 12px;
            padding-right: 20px;
            i{
                line-height: 15px;
                margin-left: 4px;
            }
        }
    }
    .xm-select-parent {
        width: 100%;
        .xm-cz{
            color: #fff;
            margin-right: 20px !important;
            &:hover{
                color: $theme;
            }
        }
        dd >  .xm-cz{
          right: 0px;
          margin-right: 10px !important;
        }
        .xm-form-select dl{
            background: #000;
            border-color: #333;
            .xm-select-tips{
                background-color: #000 !important;
            }
            dd:hover{
                background: #333 !important;
                .xm-form-checkbox > span{
                    color: #fff !important;
                }
            }
        }
        .xm-form-checkbox > span{
            color: #fff;
        }
        .xm-form-checkbox > i{
            border-color: $theme;
            color: $theme;
        }
        .xm-input{
            background: none;
            padding: 0;
            border:none;
            &::placeholder{
                color: #fff;
            }
        }
    }
}
.layergamedblist{
    padding: 0.4rem;
    width: 6rem;
    display: none;
    .box{
        display: flex;
        align-items: center;
        .imgbox{
            text-align: center;
            line-height: 0.5rem;
            padding-right: 0.2rem;
            img{
                margin: 0 auto;
                max-width: 1.7rem;
                display: block;
                margin: 0 auto;
                margin-bottom: 0.1rem;
            }
        }
        .flex1{
            flex: 1;
            padding-left: 0.2rem;
            overflow: hidden;
            .title{
                line-height: 0.45rem;
                padding-bottom: 0.1rem;
                padding: 0;
            }
            .labbox{
                display: flex;
                .lab{
                    display: block;
                    cursor: pointer;
                    flex: 1;
                    padding:0.2rem 0 0;
                    &:hover,&.on{
                        color: $theme;
                        .ico_{
                            .ico i{
                                background-position-y: -0.5rem;
                            }
                        }
                    }
                   .ico_{
                    display: flex;
                    line-height: 0.4rem;
                    font-size: 0.2rem;
                      .ico{
                        margin-right: 0.15rem;
                        i{
                            display: block;
                          width: 0.42rem;  
                          height: 0.42rem;  
                        }
                        .ico1{background-position: 0 0;}
                        .ico2{background-position: -4.5rem 0;}
                      }
                   } 
                   p{
                    padding-top: 0.15rem;
                    font-size: 0.2rem;
                   }
                }
            }
        }
    }   
}